<!--
 * @Description: 备份
 * @Author: zy
 * @Date: 2021-04-21 10:42:12
 * @LastEditors: zy
 * @LastEditTime: 2021-04-21 10:42:37
-->
    <el-row style="height: 250px">
      <!-- panel -->
      <el-col :span="4" style="height: 250px; border: 1px solid">
        <!-- 获取作图区域的长度与宽度 -->
        <el-row id="range" style="height: 50px; margin-top: 5px" :gutter="10">
          <el-col :span="9" style="height: 100%; margin-left: 5px">
            <el-input v-model="heigth" placeholder="请输入长度"></el-input>
          </el-col>
          <el-col :span="9" style="height: 100%">
            <el-input v-model="width" placeholder="请输入宽度"></el-input>
          </el-col>
          <el-col :span="5" style="height: 100%">
            <el-button size="mini" @click="initCanvas">确定</el-button>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form size="mini" ref="form" :model="form" label-width="70px">
              <el-form-item label="起点">
                <el-input
                  id="startPoint"
                  v-model="form.start"
                  style="width: 150px"
                ></el-input>
              </el-form-item>
              <el-form-item label="终点">
                <el-input
                  id="endPoint"
                  v-model="form.end"
                  style="width: 150px"
                ></el-input>
              </el-form-item>
              <el-form-item label="场地名称">
                <el-input v-model="form.name" style="width: 150px"></el-input>
              </el-form-item>
              <el-form-item style="margin-left: -30px">
                <el-button type="primary" @click="regionalization"
                  >场地划分</el-button
                >
                <el-button type="primary" @click="onSubmit">立即创建</el-button>
                <el-button>取消</el-button>
              </el-form-item>
            </el-form>
          </el-col>
        </el-row>
      </el-col>
      <!-- 人数折线图区域 -->
      <el-col :span="12" style="height: 250px; border-top: 1px solid; border-right: 1px solid">
          <el-dropdown split-button type="primary" size="mini" @click="handleClick()">
            选择时间
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item>第一天</el-dropdown-item>
            <el-dropdown-item>第二天</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>

        <el-dropdown split-button type="primary" size="mini" @click="handleClick()">
          选择地点
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item>会场入口</el-dropdown-item>
            <el-dropdown-item>会议室</el-dropdown-item>
            <el-dropdown-item>一楼大厅</el-dropdown-item>
            <el-dropdown-item>二楼厕所</el-dropdown-item>
            <el-dropdown-item>楼梯</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
        <div id="peopleNumber">111</div>
      </el-col>
      <!-- 很多仪表盘 -->
      <el-col :span="8" style="height: 250px; border-top: 1px solid; border-right: 1px solid">
        <div id="gauge"></div>
      </el-col>
    </el-row>
    <!-- 作图区域 -->
    <el-row style="height: calc(100% - 250px); border: 1px solid">
      <el-col :span="16" style="height: 100%; border-right: 1px solid">
        <div id="canvas"></div>
      </el-col>
      <el-col :span="8" style="height: 100%;">
        <div id="sankey"></div>
      </el-col>
    </el-row>
